<!doctype html>
<html class="no-js" lang="en">
	<head>
		<meta charset="utf-8">
		<meta http-equiv="x-ua-compatible" content="ie=edge">
		<title>商店</title>
		<meta name="description" content="Hurst – Furniture Store eCommerce HTML Template is a clean and elegant design – suitable for selling flower, cookery, accessories, fashion, high fashion, accessories, digital, kids, watches, jewelries, shoes, kids, furniture, sports….. It has a fully responsive width adjusts automatically to any screen size or resolution.">
		<meta name="viewport" content="width=device-width, initial-scale=1">

		<link rel="shortcut icon" type="image/x-icon" href="assets/picture/favicon.ico">
		<!-- Place favicon.ico in the root directory -->

		<!-- Google Font -->
		<link href='https://fonts.googleapis.com/css?family=Lato:400,700,900' rel='stylesheet' type='text/css'>
		<link href='https://fonts.googleapis.com/css?family=Bree+Serif' rel='stylesheet' type='text/css'>

		<!-- all css here -->
		<!-- bootstrap v3.3.6 css -->
		<link rel="stylesheet" href="assets/css/bootstrap.min.css">
		<!-- animate css -->
		<link rel="stylesheet" href="assets/css/animate.min.css">
		<!-- jquery-ui.min css -->
		<link rel="stylesheet" href="assets/css/jquery-ui.min.css">
		<!-- meanmenu css -->
		<link rel="stylesheet" href="assets/css/meanmenu.min.css">
		<!-- nivo-slider css -->
		<link rel="stylesheet" href="assets/css/nivo-slider.css">
		<link rel="stylesheet" href="assets/css/preview.css">
		<!-- slick css -->
		<link rel="stylesheet" href="assets/css/slick.min.css">
		<!-- lightbox css -->
		<link rel="stylesheet" href="assets/css/lightbox.min.css">
		<!-- material-design-iconic-font css -->
		<link rel="stylesheet" href="assets/css/material-design-iconic-font.css">
		<!-- All common css of theme -->
		<link rel="stylesheet" href="assets/css/default.css">
		<!-- style css -->
		<link rel="stylesheet" href="assets/css/style.min.css">
        <!-- shortcode css -->
        <link rel="stylesheet" href="assets/css/shortcode.css">
		<!-- responsive css -->
		<link rel="stylesheet" href="assets/css/responsive.css">
		<!-- modernizr css -->
		<script src="assets/js/modernizr-3.11.2.min.js"></script>
	</head>
	<body>
		<!-- WRAPPER START -->
		<div class="wrapper bg-dark-white">

			<!-- HEADER-AREA START -->
			<header id="sticky-menu" class="header header-2">
				<div class="header-area">
					<div class="container-fluid">
						<div class="row">
							<div class="col-md-4 offset-md-4 col-7">
								<div class="logo text-md-center">
									<a href="index.html"><img src="assets/picture/logo.png" alt=""></a>
								</div>
							</div>
							<div class="col-md-4 col-5">
<!--								<div class="mini-cart text-end">-->
<!--									<ul>-->
<!--										<li>-->
<!--											<a class="cart-icon" href="#">-->
<!--												<i class="zmdi zmdi-shopping-cart"></i>-->
<!--&lt;!&ndash;												TODO 计算综合，这是右上角购物车小红数量&ndash;&gt;-->
<!--												<span>3</span>-->
<!--											</a>-->
<!--											<div class="mini-cart-brief text-left">-->
<!--												<div class="cart-items">-->
<!--													<p class="mb-0">你有 <span>计算总和（几个东西</span> 在你的购物车</p>-->
<!--												</div>-->
<!--												&lt;!&ndash;TODO 购物车&ndash;&gt;-->
<!--												<div class="all-cart-product clearfix">-->
<!--													&lt;!&ndash;TODO 单个购物车内容&ndash;&gt;-->
<!--													<div class="single-cart clearfix">-->
<!--														<div class="cart-photo">-->
<!--															&lt;!&ndash;TODO 传图&ndash;&gt;-->
<!--															<a href="#"><img src="" alt=""></a>-->
<!--														</div>-->
<!--														<div class="cart-info">-->
<!--															&lt;!&ndash;TODO 传名&ndash;&gt;-->
<!--															<h5><a href="#">dummy product name</a></h5>-->
<!--															&lt;!&ndash;TODO 传价格&ndash;&gt;-->
<!--															<p class="mb-0">Price : $ 100.00</p>-->
<!--															<p class="mb-0">Qty : 02 </p>-->
<!--															<span class="cart-delete"><a href="#">-->
<!--																<i class="zmdi zmdi-close"></i></a></span>-->
<!--														</div>-->
<!--													</div>-->
<!--												</div>-->
<!--												<div class="cart-totals">-->
<!--													&lt;!&ndash;TODO 计算总价格&ndash;&gt;-->
<!--													<h5 class="mb-0">Total <span class="floatright">$500.00</span></h5>-->
<!--												</div>-->
<!--												<div class="cart-bottom  clearfix">-->
<!--													&lt;!&ndash;右上角购物车跳转总购物车页面&ndash;&gt;-->
<!--													<a href="cart.html" class="button-one floatleft text-uppercase"-->
<!--													   data-text="View cart">购物车</a>-->
<!--													<a href="checkout.html" class="button-one floatright text-uppercase"-->
<!--													   data-text="Check out">支付</a>-->
<!--												</div>-->
<!--											</div>-->
<!--										</li>-->
<!--									</ul>-->
<!--								</div>-->
							</div>
						</div>
					</div>
				</div>
				<!-- MAIN-MENU START -->
				<div class="menu-toggle menu-toggle-2 hamburger hamburger--emphatic d-none d-md-block">
					<div class="hamburger-box">
						<div class="hamburger-inner"></div>
					</div>
				</div>
				<div class="main-menu  d-none d-md-block">
					<nav>
						<ul>
							<li><a href="index.html">主页</a></li>
							<li><a href="shop.html">商品</a>
								<div class="mega-menu menu-scroll">
									<div class="table">
										<div class="table-cell">
											<div class="half-width">
												<ul>
													<li class="menu-title">高评分</li>
													<!--TODO 商品列表-->
													<li><a href="#">henning koppel</a></li>
													<li><a href="#">jehs + Laub</a></li>
													<li><a href="#">vicke lindstrand</a></li>
													<li><a href="#">don chadwick</a></li>
													<li><a href="#">akiko kuwahata</a></li>
													<li><a href="#">barbro berlin</a></li>
													<li><a href="#">cecilia hall</a></li>
													<li><a href="#">don chadwick</a></li>
												</ul>
											</div>
											<div class="half-width">
												<ul>
													<li class="menu-title">流行的</li>
													<!--TODO 商品列表-->
													<li><a href="#">akiko kuwahata</a></li>
													<li><a href="#">barbro berlin</a></li>
													<li><a href="#">cecilia hall</a></li>
													<li><a href="#">don chadwick</a></li>
													<li><a href="#">henning koppel</a></li>
													<li><a href="#">jehs + Laub</a></li>
													<li><a href="#">vicke lindstrand</a></li>
													<li><a href="#">don chadwick</a></li>
												</ul>
											</div>
											<div class="full-width">
												<div class="mega-menu-img">
													<!--TODO 商品列表下的图片保留?更改-->
													<a href="single-product.html"><img src="assets/picture/13.jpg" alt=""></a>
												</div>
											</div>
											<div class="pb-80"></div>
										</div>
									</div>
								</div>
							</li>
							<li><a href="cart.html">购物车</a>
							</li>
							<li><a href="my-account.html">个人信息</a></li>

							<li><a href="about.html">关于我们</a></li>
							<li><a href="contact.html">导航</a></li>
						</ul>
					</nav>
				</div>
				<!-- MAIN-MENU END -->
			</header>
			<!-- HEADER-AREA END -->
			<!-- Mobile-menu start -->
			<div class="mobile-menu-area">
				<div class="container-fluid">
					<div class="row">
						<div class="col-xs-12 d-block d-md-none">
							<div class="mobile-menu">
								<nav id="dropdown">
									<ul>
										<li><a href="index.html">home</a>
											<ul>
												<li><a href="index.html">Home Version 1</a></li>
												<li><a href="index-2.html">Home Version 2</a></li>
											</ul>
										</li>
										<li><a href="">products</a></li>
										<li><a href="shop-sidebar.html">accesories</a></li>
										<li><a href="shop-list.html">lookbook</a></li>
										<li><a href="blog.html">blog</a></li>
										<li><a href="#">pages</a>
											<ul>
												<li><a href="">Shop</a></li>
												<li><a href="shop-sidebar.html">Shop Sidebar</a></li>
												<li><a href="shop-list.html">Shop List</a></li>
												<li><a href="single-product.html">Single Product</a></li>
												<li><a href="single-product-sidebar.html">Single Product Sidebar</a></li>
												<li><a href="cart.html">Shopping Cart</a></li>
												<li><a href="wishlist.html">Wishlist</a></li>
												<li><a href="checkout.html">Checkout</a></li>
												<li><a href="order.html">Order</a></li>
												<li><a href="login.html">login / Registration</a></li>
												<li><a href="my-account.html">My Account</a></li>
												<li><a href="404.html">404</a></li>
												<li><a href="blog.html">Blog</a></li>
												<li><a href="single-blog.html">Single Blog</a></li>
												<li><a href="single-blog-sidebar.html">Single Blog Sidebar</a></li>
												<li><a href="about.html">About Us</a></li>
												<li><a href="contact.html">Contact</a></li>
											</ul>
										</li>
										<li><a href="about.html">about us</a></li>
										<li><a href="contact.html">contact</a></li>
									</ul>
								</nav>
							</div>
						</div>
					</div>
				</div>
			</div>
			<!-- Mobile-menu end -->
			<!-- HEADING-BANNER START -->
			<div class="heading-banner-area overlay-bg">
				<div class="container">
					<div class="row">
						<div class="col-md-12">
							<div class="heading-banner">
								<div class="heading-banner-title">
									<h2>Shop</h2>
								</div>
								<div class="breadcumbs pb-15">
									<ul>
										<li><a href="#">主页</a></li>
										<li>商店</li>
									</ul>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
			<!-- HEADING-BANNER END -->
			<!-- PRODUCT-AREA START -->
			<div class="product-area pt-80 pb-80 product-style-2">
				<div class="container">
					<!-- Shop-Content End -->
					<div class="shop-content">
						<div class="row">
							<div class="col-md-12">
								<div class="product-option mb-30 clearfix">
                                    <!-- Categories start  分类筛选-->
                                    <div class="dropdown floatleft">
                                        <button class="option-btn active" data-toggle="dropdown">
                                            种类
                                        </button>
                                        <div class="dropdown-menu dropdown-width">
                                            <!-- Widget-Categories start -->
                                            <aside class="widget widget-categories">
                                                <div class="widget-title">
                                                    <h4>种类</h4>
                                                </div>
                                                <div id="cat-treeview" class="widget-info product-cat boxscrol2">
                                                    <ul>
                                                        <li><span>椅子</span>
                                                            <ul>
                                                                <li><a href="#">T恤</a></li>
                                                                <li><a href="#">条纹衬衫</a></li>
                                                                <li><a href="#">正装衬衫</a></li>
                                                            </ul>
                                                        </li>
                                                        <li class="open"><span>设备</span>
                                                            <ul>
                                                                <li><a href="#">包</a></li>
                                                                <li><a href="#">鞋</a></li>
                                                                <li><a href="#">表</a></li>
                                                            </ul>
                                                        </li>
                                                        <li><span>配件</span>
                                                            <ul>
                                                                <li><a href="#">T-Shirts</a></li>
                                                                <li><a href="#">Striped Shirts</a></li>
                                                                <li><a href="#">Half Shirts</a></li>
                                                                <li><a href="#">Formal Shirts</a></li>
                                                                <li><a href="#">Bilazers</a></li>
                                                            </ul>
                                                        </li>
                                                        <li><span>品牌</span>
                                                            <ul>
                                                                <li><a href="#">T-Shirts</a></li>
                                                                <li><a href="#">Striped Shirts</a></li>
                                                                <li><a href="#">Half Shirts</a></li>
                                                                <li><a href="#">Formal Shirts</a></li>
                                                                <li><a href="#">Bilazers</a></li>
                                                            </ul>
                                                        </li>
                                                        <li><span>奢侈品</span>
                                                            <ul>
                                                                <li><a href="#">T-Shirts</a></li>
                                                                <li><a href="#">Striped Shirts</a></li>
                                                                <li><a href="#">Half Shirts</a></li>
                                                                <li><a href="#">Formal Shirts</a></li>
                                                                <li><a href="#">Bilazers</a></li>
                                                            </ul>
                                                        </li>
                                                    </ul>
                                                </div>
                                            </aside>
                                            <!-- Widget-categories end -->
                                        </div>
                                    </div>
                                    <!-- Categories end -->
                                    <!-- Price start -->
                                    <div class="dropdown floatleft">
                                        <button class="option-btn" data-toggle="dropdown">
                                            价格
                                        </button>
                                        <div class="dropdown-menu dropdown-width">
                                            <!-- Shop-Filter start -->
                                            <aside class="widget shop-filter">
                                                <div class="widget-title">
                                                    <h4>价格</h4>
                                                </div>
                                                <div class="widget-info">
                                                    <div class="price_filter">
                                                        <div class="price_slider_amount">
                                                            <input type="submit" value="You range :">
                                                            <input type="text" id="amount" name="price"
                                                                   placeholder="Add Your Price">
                                                        </div>
                                                        <div id="slider-range"></div>
                                                    </div>
                                                </div>
                                            </aside>
                                            <!-- Shop-Filter end -->
                                        </div>
                                    </div>
                                    <!-- Price end -->
                                    <!-- Color start -->
                                    <div class="dropdown floatleft">
                                        <button class="option-btn" data-toggle="dropdown">
                                            颜色
                                        </button>
                                        <div class="dropdown-menu dropdown-width">
                                            <!-- Widget-Color start -->
                                            <aside class="widget widget-color">
                                                <div class="widget-title">
                                                    <h4>颜色</h4>
                                                </div>
                                                <div class="widget-info color-filter clearfix">
                                                    <ul>
                                                        <!--                                                TODO 颜色筛选，颜色数量删除？动态传值？-->
                                                        <li><a href="#"><span class="color color-1"></span>亮日光<span
                                                                class="count">12</span></a></li>
                                                        <li><a href="#"><span class="color color-2"></span>黑色<span
                                                                class="count">20</span></a></li>
                                                        <li><a href="#"><span class="color color-3"></span>西红色<span
                                                                class="count">59</span></a></li>
                                                        <li><a class="active" href="#"><span class="color color-4"></span>
                                                            深天空蓝<span class="count">45</span></a></li>
                                                        <li><a href="#"><span class="color color-5"></span>电紫色<span
                                                                class="count">78</span></a></li>
                                                        <li><a href="#"><span class="color color-6"></span>亚特兰蒂斯绿<span
                                                                class="count">10</span></a></li>
                                                        <li><a href="#"><span class="color color-7"></span>深淡紫色<span
                                                                class="count">15</span></a></li>
                                                    </ul>
                                                </div>
                                            </aside>
                                            <!-- Widget-Color end -->
                                        </div>
                                    </div>
                                    <!-- Color end -->
                                    <!-- Size start -->
                                    <div class="dropdown floatleft">
                                        <button class="option-btn" data-toggle="dropdown">
                                            尺寸
                                        </button>
                                        <div class="dropdown-menu dropdown-width">
                                            <!-- Widget-Size start -->
                                            <aside class="widget widget-size">
                                                <div class="widget-title">
                                                    <h4>尺寸</h4>
                                                </div>
                                                <div class="widget-info size-filter clearfix">
                                                    <ul>
                                                        <li><a href="#">M</a></li>
                                                        <li><a class="active" href="#">S</a></li>
                                                        <li><a href="#">L</a></li>
                                                        <li><a href="#">SL</a></li>
                                                        <li><a href="#">XL</a></li>
                                                    </ul>
                                                </div>
                                            </aside>
                                            <!-- Widget-Size end -->
                                        </div>
                                    </div>
									<!-- Size end -->

								</div>
							</div>

<!--							*******************************商品展示*************-->
<!--							TODO 商品展示-->
							<div class="col-md-12">
								<div class="row">
									<!-- Single-product start -->
									<div class="col-xl-3 col-md-4">
										<div class="single-product">
											<div class="product-img">
												<span class="pro-label new-label">new</span>
												<span class="pro-price-2">$ 56.20</span>
												<a href="single-product.html"><img src="assets/picture/6.jpg" alt=""></a>
											</div>
											<div class="product-info clearfix text-center">
												<div class="fix">
													<h4 class="post-title"><a href="#">dummy Product name</a></h4>
												</div>
												<div class="fix">
													<span class="pro-rating">
														<a href="#"><i class="zmdi zmdi-star"></i></a>
														<a href="#"><i class="zmdi zmdi-star"></i></a>
														<a href="#"><i class="zmdi zmdi-star"></i></a>
														<a href="#"><i class="zmdi zmdi-star-half"></i></a>
														<a href="#"><i class="zmdi zmdi-star-half"></i></a>
													</span>
												</div>
												<div class="product-action clearfix">
													<a href="wishlist.html" data-bs-toggle="tooltip" data-placement="top" title="Wishlist"><i class="zmdi zmdi-favorite-outline"></i></a>
													<a href="#" data-bs-toggle="modal" data-bs-target="#productModal" title="Quick View"><i class="zmdi zmdi-zoom-in"></i></a>
													<a href="#" data-bs-toggle="tooltip" data-placement="top" title="Compare"><i class="zmdi zmdi-refresh"></i></a>
													<a href="cart.html" data-bs-toggle="tooltip" data-placement="top" title="Add To Cart"><i class="zmdi zmdi-shopping-cart-plus"></i></a>
												</div>
											</div>
										</div>
									</div>
									<!-- Single-product end -->
									<!-- Single-product start -->
<!--									商品展示  之后几个div都是表示相同的意思只有商品不一样-->
									<div class="col-xl-3 col-md-4">
										<!--TODO 后续商品展示传值-->
										<div class="single-product">
											<div class="product-img">
<!--												商品热销以及价格-->
												<span class="pro-label sale-label">Sale</span>
												<span class="pro-price-2">$ 56.20</span>
<!--												跳转到产品详情页面,展示不是该商品需要返回该商品具体的信息-->
												<a href="single-product.html"><img src="assets/picture/32.jpg" alt=""></a>
											</div>
											<div class="product-info clearfix text-center">
												<div class="fix">
													<h4 class="post-title"><a href="#">传一个产品名</a></h4>
												</div>
												<div class="fix">
<!--													这是下面的星星评分,已写死,考虑后续是否使用-->
													<span class="pro-rating">
														<a href="#"><i class="zmdi zmdi-star"></i></a>
														<a href="#"><i class="zmdi zmdi-star"></i></a>
														<a href="#"><i class="zmdi zmdi-star"></i></a>
														<a href="#"><i class="zmdi zmdi-star-half"></i></a>
														<a href="#"><i class="zmdi zmdi-star-half"></i></a>
													</span>
												</div>
												<div class="product-action clearfix">
<!--													商品收藏-->
													<a href="wishlist.html" data-bs-toggle="tooltip" data-placement="top" title="Wishlist"><i class="zmdi zmdi-favorite-outline"></i></a>
<!--													查看商品信息-->
													<a href="#" data-bs-toggle="modal" data-bs-target="#productModal" title="Quick View"><i class="zmdi zmdi-zoom-in"></i></a>
<!--													刷新商品信息-->
													<a href="#" data-bs-toggle="tooltip" data-placement="top" title="Compare"><i class="zmdi zmdi-refresh"></i></a>
<!--													添加到购物车-->
													<a href="cart.html" data-bs-toggle="tooltip" data-placement="top" title="Add To Cart"><i class="zmdi zmdi-shopping-cart-plus"></i></a>
												</div>
											</div>
										</div>
									</div>
									<!-- Single-product end -->
									<!-- Single-product start -->
									<div class="col-xl-3 col-md-4">
										<div class="single-product">
											<div class="product-img">
												<span class="pro-price-2">$ 56.20</span>
												<a href="single-product.html"><img src="assets/picture/7.jpg" alt=""></a>
											</div>
											<div class="product-info clearfix text-center">
												<div class="fix">
													<h4 class="post-title"><a href="#">dummy Product name</a></h4>
												</div>
												<div class="fix">
													<span class="pro-rating">
														<a href="#"><i class="zmdi zmdi-star"></i></a>
														<a href="#"><i class="zmdi zmdi-star"></i></a>
														<a href="#"><i class="zmdi zmdi-star"></i></a>
														<a href="#"><i class="zmdi zmdi-star-half"></i></a>
														<a href="#"><i class="zmdi zmdi-star-half"></i></a>
													</span>
												</div>
												<div class="product-action clearfix">
													<a href="wishlist.html" data-bs-toggle="tooltip" data-placement="top" title="Wishlist"><i class="zmdi zmdi-favorite-outline"></i></a>
													<a href="#" data-bs-toggle="modal" data-bs-target="#productModal" title="Quick View"><i class="zmdi zmdi-zoom-in"></i></a>
													<a href="#" data-bs-toggle="tooltip" data-placement="top" title="Compare"><i class="zmdi zmdi-refresh"></i></a>
													<a href="cart.html" data-bs-toggle="tooltip" data-placement="top" title="Add To Cart"><i class="zmdi zmdi-shopping-cart-plus"></i></a>
												</div>
											</div>
										</div>
									</div>
									<!-- Single-product end -->
									<!-- Single-product start -->
									<div class="col-xl-3 col-md-4">
										<div class="single-product">
											<div class="product-img">
												<span class="pro-label sale-label">sale</span>
												<span class="pro-price-2">$ 56.20</span>
												<a href="single-product.html"><img src="assets/picture/10.jpg" alt=""></a>
											</div>
											<div class="product-info clearfix text-center">
												<div class="fix">
													<h4 class="post-title"><a href="#">dummy Product name</a></h4>
												</div>
												<div class="fix">
													<span class="pro-rating">
														<a href="#"><i class="zmdi zmdi-star"></i></a>
														<a href="#"><i class="zmdi zmdi-star"></i></a>
														<a href="#"><i class="zmdi zmdi-star"></i></a>
														<a href="#"><i class="zmdi zmdi-star-half"></i></a>
														<a href="#"><i class="zmdi zmdi-star-half"></i></a>
													</span>
												</div>
												<div class="product-action clearfix">
													<a href="wishlist.html" data-bs-toggle="tooltip" data-placement="top" title="Wishlist"><i class="zmdi zmdi-favorite-outline"></i></a>
													<a href="#" data-bs-toggle="modal" data-bs-target="#productModal" title="Quick View"><i class="zmdi zmdi-zoom-in"></i></a>
													<a href="#" data-bs-toggle="tooltip" data-placement="top" title="Compare"><i class="zmdi zmdi-refresh"></i></a>
													<a href="cart.html" data-bs-toggle="tooltip" data-placement="top" title="Add To Cart"><i class="zmdi zmdi-shopping-cart-plus"></i></a>
												</div>
											</div>
										</div>
									</div>
									<!-- Single-product end -->
									<!-- Single-product start -->
									<div class="col-xl-3 col-md-4">
										<div class="single-product">
											<div class="product-img">
												<span class="pro-price-2">$ 56.20</span>
												<a href="single-product.html"><img src="assets/picture/8.jpg" alt=""></a>
											</div>
											<div class="product-info clearfix text-center">
												<div class="fix">
													<h4 class="post-title"><a href="#">dummy Product name</a></h4>
												</div>
												<div class="fix">
													<span class="pro-rating">
														<a href="#"><i class="zmdi zmdi-star"></i></a>
														<a href="#"><i class="zmdi zmdi-star"></i></a>
														<a href="#"><i class="zmdi zmdi-star"></i></a>
														<a href="#"><i class="zmdi zmdi-star-half"></i></a>
														<a href="#"><i class="zmdi zmdi-star-half"></i></a>
													</span>
												</div>
												<div class="product-action clearfix">
													<a href="wishlist.html" data-bs-toggle="tooltip" data-placement="top" title="Wishlist"><i class="zmdi zmdi-favorite-outline"></i></a>
													<a href="#" data-bs-toggle="modal" data-bs-target="#productModal" title="Quick View"><i class="zmdi zmdi-zoom-in"></i></a>
													<a href="#" data-bs-toggle="tooltip" data-placement="top" title="Compare"><i class="zmdi zmdi-refresh"></i></a>
													<a href="cart.html" data-bs-toggle="tooltip" data-placement="top" title="Add To Cart"><i class="zmdi zmdi-shopping-cart-plus"></i></a>
												</div>
											</div>
										</div>
									</div>
									<!-- Single-product end -->
									<!-- Single-product start -->
									<div class="col-xl-3 col-md-4">
										<div class="single-product">
											<div class="product-img">
												<span class="pro-label new-label">new</span>
												<span class="pro-price-2">$ 56.20</span>
												<a href="single-product.html"><img src="assets/picture/11.jpg" alt=""></a>
											</div>
											<div class="product-info clearfix text-center">
												<div class="fix">
													<h4 class="post-title"><a href="#">dummy Product name</a></h4>
												</div>
												<div class="fix">
													<span class="pro-rating">
														<a href="#"><i class="zmdi zmdi-star"></i></a>
														<a href="#"><i class="zmdi zmdi-star"></i></a>
														<a href="#"><i class="zmdi zmdi-star"></i></a>
														<a href="#"><i class="zmdi zmdi-star-half"></i></a>
														<a href="#"><i class="zmdi zmdi-star-half"></i></a>
													</span>
												</div>
												<div class="product-action clearfix">
													<a href="wishlist.html" data-bs-toggle="tooltip" data-placement="top" title="Wishlist"><i class="zmdi zmdi-favorite-outline"></i></a>
													<a href="#" data-bs-toggle="modal" data-bs-target="#productModal" title="Quick View"><i class="zmdi zmdi-zoom-in"></i></a>
													<a href="#" data-bs-toggle="tooltip" data-placement="top" title="Compare"><i class="zmdi zmdi-refresh"></i></a>
													<a href="cart.html" data-bs-toggle="tooltip" data-placement="top" title="Add To Cart"><i class="zmdi zmdi-shopping-cart-plus"></i></a>
												</div>
											</div>
										</div>
									</div>
									<!-- Single-product end -->
									<!-- Single-product start -->
									<div class="col-xl-3 col-md-4">
										<div class="single-product">
											<div class="product-img">
												<span class="pro-label new-label">new</span>
												<span class="pro-price-2">$ 56.20</span>
												<a href="single-product.html"><img src="assets/picture/23.jpg" alt=""></a>
											</div>
											<div class="product-info clearfix text-center">
												<div class="fix">
													<h4 class="post-title"><a href="#">dummy Product name</a></h4>
												</div>
												<div class="fix">
													<span class="pro-rating">
														<a href="#"><i class="zmdi zmdi-star"></i></a>
														<a href="#"><i class="zmdi zmdi-star"></i></a>
														<a href="#"><i class="zmdi zmdi-star"></i></a>
														<a href="#"><i class="zmdi zmdi-star-half"></i></a>
														<a href="#"><i class="zmdi zmdi-star-half"></i></a>
													</span>
												</div>
												<div class="product-action clearfix">
													<a href="wishlist.html" data-bs-toggle="tooltip" data-placement="top" title="Wishlist"><i class="zmdi zmdi-favorite-outline"></i></a>
													<a href="#" data-bs-toggle="modal" data-bs-target="#productModal" title="Quick View"><i class="zmdi zmdi-zoom-in"></i></a>
													<a href="#" data-bs-toggle="tooltip" data-placement="top" title="Compare"><i class="zmdi zmdi-refresh"></i></a>
													<a href="cart.html" data-bs-toggle="tooltip" data-placement="top" title="Add To Cart"><i class="zmdi zmdi-shopping-cart-plus"></i></a>
												</div>
											</div>
										</div>
									</div>
									<!-- Single-product end -->
									<!-- Single-product start -->
									<div class="col-xl-3 col-md-4">
										<div class="single-product">
											<div class="product-img">
												<span class="pro-price-2">$ 56.20</span>
												<a href="single-product.html"><img src="assets/picture/16.jpg" alt=""></a>
											</div>
											<div class="product-info clearfix text-center">
												<div class="fix">
													<h4 class="post-title"><a href="#">dummy Product name</a></h4>
												</div>
												<div class="fix">
													<span class="pro-rating">
														<a href="#"><i class="zmdi zmdi-star"></i></a>
														<a href="#"><i class="zmdi zmdi-star"></i></a>
														<a href="#"><i class="zmdi zmdi-star"></i></a>
														<a href="#"><i class="zmdi zmdi-star-half"></i></a>
														<a href="#"><i class="zmdi zmdi-star-half"></i></a>
													</span>
												</div>
												<div class="product-action clearfix">
													<a href="wishlist.html" data-bs-toggle="tooltip" data-placement="top" title="Wishlist"><i class="zmdi zmdi-favorite-outline"></i></a>
													<a href="#" data-bs-toggle="modal" data-bs-target="#productModal" title="Quick View"><i class="zmdi zmdi-zoom-in"></i></a>
													<a href="#" data-bs-toggle="tooltip" data-placement="top" title="Compare"><i class="zmdi zmdi-refresh"></i></a>
													<a href="cart.html" data-bs-toggle="tooltip" data-placement="top" title="Add To Cart"><i class="zmdi zmdi-shopping-cart-plus"></i></a>
												</div>
											</div>
										</div>
									</div>
									<!-- Single-product end -->
									<!-- Single-product start -->
									<div class="col-xl-3 col-md-4">
										<div class="single-product">
											<div class="product-img">
												<span class="pro-label new-label">new</span>
												<span class="pro-price-2">$ 56.20</span>
												<a href="single-product.html"><img src="assets/picture/12.jpg" alt=""></a>
											</div>
											<div class="product-info clearfix text-center">
												<div class="fix">
													<h4 class="post-title"><a href="#">dummy Product name</a></h4>
												</div>
												<div class="fix">
													<span class="pro-rating">
														<a href="#"><i class="zmdi zmdi-star"></i></a>
														<a href="#"><i class="zmdi zmdi-star"></i></a>
														<a href="#"><i class="zmdi zmdi-star"></i></a>
														<a href="#"><i class="zmdi zmdi-star-half"></i></a>
														<a href="#"><i class="zmdi zmdi-star-half"></i></a>
													</span>
												</div>
												<div class="product-action clearfix">
													<a href="wishlist.html" data-bs-toggle="tooltip" data-placement="top" title="Wishlist"><i class="zmdi zmdi-favorite-outline"></i></a>
													<a href="#" data-bs-toggle="modal" data-bs-target="#productModal" title="Quick View"><i class="zmdi zmdi-zoom-in"></i></a>
													<a href="#" data-bs-toggle="tooltip" data-placement="top" title="Compare"><i class="zmdi zmdi-refresh"></i></a>
													<a href="cart.html" data-bs-toggle="tooltip" data-placement="top" title="Add To Cart"><i class="zmdi zmdi-shopping-cart-plus"></i></a>
												</div>
											</div>
										</div>
									</div>
									<!-- Single-product end -->
									<!-- Single-product start -->
									<div class="col-xl-3 col-md-4">
										<div class="single-product">
											<div class="product-img">
												<span class="pro-label new-label">new</span>
												<span class="pro-price-2">$ 56.20</span>
												<a href="single-product.html"><img src="assets/picture/12.jpg" alt=""></a>
											</div>
											<div class="product-info clearfix text-center">
												<div class="fix">
													<h4 class="post-title"><a href="#">dummy Product name</a></h4>
												</div>
												<div class="fix">
													<span class="pro-rating">
														<a href="#"><i class="zmdi zmdi-star"></i></a>
														<a href="#"><i class="zmdi zmdi-star"></i></a>
														<a href="#"><i class="zmdi zmdi-star"></i></a>
														<a href="#"><i class="zmdi zmdi-star-half"></i></a>
														<a href="#"><i class="zmdi zmdi-star-half"></i></a>
													</span>
												</div>
												<div class="product-action clearfix">
													<a href="wishlist.html" data-bs-toggle="tooltip" data-placement="top" title="Wishlist"><i class="zmdi zmdi-favorite-outline"></i></a>
													<a href="#" data-bs-toggle="modal" data-bs-target="#productModal" title="Quick View"><i class="zmdi zmdi-zoom-in"></i></a>
													<a href="#" data-bs-toggle="tooltip" data-placement="top" title="Compare"><i class="zmdi zmdi-refresh"></i></a>
													<a href="cart.html" data-bs-toggle="tooltip" data-placement="top" title="Add To Cart"><i class="zmdi zmdi-shopping-cart-plus"></i></a>
												</div>
											</div>
										</div>
									</div>
									<!-- Single-product end -->
									<!-- Single-product start -->
									<div class="col-xl-3 col-md-4">
										<div class="single-product">
											<div class="product-img">
												<span class="pro-label new-label">新</span>
												<span class="pro-price-2">$ 56.20</span>
												<a href="single-product.html"><img src="assets/picture/12.jpg" alt=""></a>
											</div>
											<div class="product-info clearfix text-center">
												<div class="fix">
													<h4 class="post-title"><a href="#">dummy Product name</a></h4>
												</div>
												<div class="fix">
													<span class="pro-rating">
														<a href="#"><i class="zmdi zmdi-star"></i></a>
														<a href="#"><i class="zmdi zmdi-star"></i></a>
														<a href="#"><i class="zmdi zmdi-star"></i></a>
														<a href="#"><i class="zmdi zmdi-star-half"></i></a>
														<a href="#"><i class="zmdi zmdi-star-half"></i></a>
													</span>
												</div>
												<div class="product-action clearfix">
													<a href="wishlist.html" data-bs-toggle="tooltip" data-placement="top" title="Wishlist"><i class="zmdi zmdi-favorite-outline"></i></a>
													<a href="#" data-bs-toggle="modal" data-bs-target="#productModal" title="Quick View"><i class="zmdi zmdi-zoom-in"></i></a>
													<a href="#" data-bs-toggle="tooltip" data-placement="top" title="Compare"><i class="zmdi zmdi-refresh"></i></a>
													<a href="cart.html" data-bs-toggle="tooltip" data-placement="top" title="Add To Cart"><i class="zmdi zmdi-shopping-cart-plus"></i></a>
												</div>
											</div>
										</div>
									</div>
									<!-- Single-product end -->
									<!-- Single-product start -->
									<div class="col-xl-3 col-md-4">
										<div class="single-product">
											<div class="product-img">
												<span class="pro-label new-label">新</span>
												<span class="pro-price-2">$ 56.20</span>
												<a href="single-product.html"><img src="assets/picture/12.jpg" alt=""></a>
											</div>
											<div class="product-info clearfix text-center">
												<div class="fix">
													<h4 class="post-title"><a href="#">虚拟产品名称？</a></h4>
												</div>
												<div class="fix">
													<span class="pro-rating">
														<a href="#"><i class="zmdi zmdi-star"></i></a>
														<a href="#"><i class="zmdi zmdi-star"></i></a>
														<a href="#"><i class="zmdi zmdi-star"></i></a>
														<a href="#"><i class="zmdi zmdi-star-half"></i></a>
														<a href="#"><i class="zmdi zmdi-star-half"></i></a>
													</span>
												</div>
												<div class="product-action clearfix">
													<a href="wishlist.html" data-bs-toggle="tooltip" data-placement="top" title="Wishlist"><i class="zmdi zmdi-favorite-outline"></i></a>
													<a href="#" data-bs-toggle="modal" data-bs-target="#productModal" title="Quick View"><i class="zmdi zmdi-zoom-in"></i></a>
													<a href="#" data-bs-toggle="tooltip" data-placement="top" title="Compare"><i class="zmdi zmdi-refresh"></i></a>
													<a href="cart.html" data-bs-toggle="tooltip" data-placement="top" title="Add To Cart"><i class="zmdi zmdi-shopping-cart-plus"></i></a>
												</div>
											</div>
										</div>
									</div>
									<!-- Single-product end -->
								</div>
							</div>
<!--							***************************************-->


							<div class="col-md-12">
								<!-- Pagination start -->
<!--								分页展示-->
								<div class="shop-pagination  text-center">
									<div class="pagination">
										<ul>
											<li><a href="#"><i class="zmdi zmdi-long-arrow-left"></i></a></li>
											<li><a href="#">01</a></li>
											<li><a class="active" href="#">02</a></li>
											<li><a href="#">03</a></li>
											<li><a href="#">04</a></li>
											<li><a href="#">05</a></li>
											<li><a href="#"><i class="zmdi zmdi-long-arrow-right"></i></a></li>
										</ul>
									</div>
								</div>
								<!-- Pagination end -->
							</div>
						</div>
					</div>
					<!-- Shop-Content End -->
				</div>
			</div>
			<!-- PRODUCT-AREA END -->
			<!-- FOOTER START -->
			<footer>
				<!-- Footer-area start -->
<!--				各个品牌商家的信息以及跳转页面-->
				<div class="footer-area footer-2">
                    <div class="container">
                        <div class="row">
                            <div class="col-lg-4 col-md-6">
                                <div class="single-footer">
									<h3 class="footer-title  title-border">Call我们</h3>
									<ul class="footer-contact">
										<li><span>地址 :</span>传个地址吗,<br>地址名, 国家名</li>
										<li><span>手机 :</span>传个手机号？</li>
										<li><span>Email :</span>传个邮件地址？</li>
									</ul>
                                </div>
                            </div>
                            <div class="col-lg-2 col-md-3 col-sm-6">
                                <div class="single-footer">
                                    <h3 class="footer-title  title-border">帐目</h3>
                                    <ul class="footer-menu">
										<li><a href="contact.html"><i class="zmdi zmdi-dot-circle"></i>我的账目</a></li>
										<li><a href="wishlist.html"><i class="zmdi zmdi-dot-circle"></i>我的 Wishlist</a></li>
										<li><a href="cart.html"><i class="zmdi zmdi-dot-circle"></i>我的购物车</a></li>
										<li><a href="login.html"><i class="zmdi zmdi-dot-circle"></i>Sign In</a></li>
										<li><a href="#"><i class="zmdi zmdi-dot-circle"></i>Check out</a></li>
                                    </ul>
                                </div>
                            </div>
                            <div class="col-lg-2 col-md-3 col-sm-6">
                                <div class="single-footer">
                                    <h3 class="footer-title  title-border">购物</h3>
                                    <ul class="footer-menu">
										<!--TODO 是否需要更改删除-->
										<li><a href="#new-arrivals"><i class="zmdi zmdi-dot-circle"></i>新商品New Products</a></li>
										<li><a href="#"><i class="zmdi zmdi-dot-circle"></i>Top Sellers</a></li>
										<li><a href="#"><i class="zmdi zmdi-dot-circle"></i>制造商</a></li>
										<li><a href="#"><i class="zmdi zmdi-dot-circle"></i>供应商家</a></li>
										<li><a href="#discounts"><i class="zmdi zmdi-dot-circle"></i>特价</a></li>
                                    </ul>
                                </div>
                            </div>
                            <div class="col-lg-4 col-md-6">
                                <div class="single-footer newsletter-item">
                                    <h3 class="footer-title  title-border">订阅一个邮件</h3>
                                    <div class="footer-subscribe">
                                        <form action="javascript:;">
                                            <input type="text" name="email" placeholder="邮件地址...">
                                            <button class="button-one submit-btn-4" type="submit" data-text="Subscribe">订阅</button>
                                        </form>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
				<!-- Footer-area end -->
				<!-- Copyright-area start -->
				<div class="copyright-area copyright-2">
					<div class="container">
						<div class="row">
							<div class="col-md-6">
								<div class="copyright">
									<p class="mb-0">&copy; 2025.版权所有。 <a target="_blank" href="/" title="网站模板">我们的网站</a></p>
								</div>
							</div>
							<div class="col-md-6">
								<div class="payment  text-md-end">
									<a href="https://wx.qq.com/"><img src="assets/picture/1.png" alt=""></a>
									<a href="https://wx.qq.com/"><img src="assets/picture/2.png" alt=""></a>
									<a href="https://wx.qq.com/"><img src="assets/picture/3.png" alt=""></a>
									<a href="https://wx.qq.com/"><img src="assets/picture/4.png" alt=""></a>
								</div>
							</div>
						</div>
					</div>
				</div>
				<!-- Copyright-area start -->
			</footer>
			<!-- FOOTER END -->
			<!-- QUICKVIEW PRODUCT 商品具体信息-->
			<!-- TODO 动态传商品具体信息 -->
			<div id="quickview-wrapper">
			   <!-- Modal -->
			   <div class="modal fade" id="productModal" tabindex="-1" role="dialog">
					<div class="modal-dialog" role="document">
						<div class="modal-content">
							<div class="modal-header">
								<button type="button" class="close" data-bs-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
							</div>
							<div class="modal-body">
								<div class="modal-product">
									<div class="product-images">
										<div class="main-image images">
<!--											TODO 这tm是查看具体商品的我草 根据id传商品信息-->
											<img alt="#" src="assets/picture/quickview-photo.jpg">
										</div>
									</div><!-- .product-images -->

									<div class="product-info">
										<h1>这里应该要个商品名</h1>
										<div class="price-box-3">
											<hr>
											<div class="s-price-box">
												<span class="new-price">$160.00</span>
												<span class="old-price">$190.00</span>
											</div>
											<hr>
										</div>
										<a href="" class="see-all">查看所有功能in shop</a>
										<div class="quick-add-to-cart">
											<form method="post" class="cart">
												<div class="numbers-row">
													<input type="number" id="french-hens" value="3" min="1">
												</div>
												<button class="single_add_to_cart_button" type="submit">添加至购物车</button>
											</form>
										</div>
										<div class="quick-desc">
											一段用来填充板块的无意义文字
										</div>
										<div class="social-sharing">
											<div class="widget widget_socialsharing_widget">
												<h3 class="widget-title-modal">分享商品</h3>
												<ul class="social-icons">
													<li><a target="_blank" title="Google +" href="https://www.google.com/" class="gplus social-icon"><i class="zmdi zmdi-google-plus"></i></a></li>
													<li><a target="_blank" title="Twitter" href="https://baike.baidu.com/item/Twitter/2443267" class="twitter social-icon"><i class="zmdi zmdi-twitter"></i></a></li>
													<li><a target="_blank" title="Facebook" href="https://zh-cn.facebook.com/" class="facebook social-icon"><i class="zmdi zmdi-facebook"></i></a></li>
													<li><a target="_blank" title="LinkedIn" href="https://www.linkedin.com/" class="linkedin social-icon"><i class="zmdi zmdi-linkedin"></i></a></li>
												</ul>
											</div>
										</div>
									</div><!-- .product-info -->
								</div><!-- .modal-product -->
							</div><!-- .modal-body -->
						</div><!-- .modal-content -->
					</div><!-- .modal-dialog -->
			   </div>
			   <!-- END Modal -->
			</div>
			<!-- END QUICKVIEW PRODUCT -->

		</div>
		<!-- WRAPPER END -->

		<!-- all js here -->
		<!-- jquery latest version -->
		<script src="assets/js/jquery-3.6.0.min.js"></script>
		<script src="assets/js/jquery-migrate-3.3.2.min.js"></script>
		<!-- bootstrap js -->
		<script src="assets/js/bootstrap.bundle.min.js"></script>
		<!-- jquery.meanmenu js -->
		<script src="assets/js/jquery.meanmenu.js"></script>
		<!-- slick.min js -->
		<script src="assets/js/slick.min.js"></script>
		<!-- jquery.treeview js -->
		<script src="assets/js/jquery.treeview.js"></script>
		<!-- lightbox.min js -->
		<script src="assets/js/lightbox.min.js"></script>
		<!-- jquery-ui js -->
		<script src="assets/js/jquery-ui.min.js"></script>
		<!-- jquery.nivo.slider js -->
		<script src="assets/js/jquery.nivo.slider.js"></script>
		<script src="assets/js/home.js"></script>
		<!-- jquery.nicescroll.min js -->
		<script src="assets/js/jquery.nicescroll.min.js"></script>
		<!-- countdon.min js -->
		<script src="assets/js/countdon.min.js"></script>
		<!-- wow js -->
		<script src="assets/js/wow.min.js"></script>
		<!-- plugins js -->
		<script src="assets/js/plugins.js"></script>
		<!-- main js -->
		<script src="assets/js/main.min.js"></script>
	</body>
</html>
